﻿
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<!-- https请求加 -->
<!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" /> -->
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
<script src="http://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js"></script>
<!--<script src="js/jquery.min.js"></script>-->
    <!-- jqGrid组件基础样式包-必要 -->
	    <link href="js/jsgrid/css/bootstrap.min.css?v=3.3.6" rel="stylesheet" />
        <link href="js/jsgrid/css/font-awesome.css?v=4.4.0" rel="stylesheet" />

        <!-- jqgrid-->
        <link href="js/jsgrid/css/plugins/jqgrid/ui.jqgrid.css?0820" rel="stylesheet" />
        <link href="js/jsgrid/css/animate.css" rel="stylesheet" />
<!--        <link href="js/jsgrid/css/style.css?v=4.1.0" rel="stylesheet" />-->
    <!-- 全局js -->
        <script src="js/jsgrid/js/bootstrap.min.js?v=3.3.6"></script>
        <!-- Peity -->
        <script src="js/jsgrid/js/plugins/peity/jquery.peity.min.js"></script>
        <!-- jqGrid -->
        <script src="js/jsgrid/js/plugins/jqgrid/i18n/grid.locale-cn.js?0820"></script>
        <script src="js/jsgrid/js/plugins/jqgrid/jquery.jqGrid.min.js?0820"></script>
    <!--layer弹窗 插件-->
    <script src="js/layer/layer.js"></script>
    <!--时间选择 插件-->
    <script src="js/My97DatePicker/WdatePicker.js"></script>
	<script src="js/login1.js"></script>
<link href="css/index.css"  rel="stylesheet"/>

    <title>首页</title>
<style type="text/css">
    
  </style>
</head>
<body>
	<div id="top">
        <div class="top_home"></div>
        <div class="top_tit">教师考勤监控平台</div>
        <div class="top_sz">
            <a>
                <ul class="setsystem">
                	<li class="people_set">人员审核</li>
                    <li class="point_set">坐标查看</li>
                    <li class="watch_set">值班信息</li>
                   <!--  <li>密码修改</li> -->
                    <li onclick="quit()">退出登录</li>
                </ul>
            </a>
        </div>
	</div>
    <div id="cont">
        <div class="menu">
            <div class="user">
                <img class="usericon" src="images/index/usericon.png" />
                <span id="username" class="username"></span>
            </div>
            <ul class="menuz">
                <li class="liactive">当日状态</li>
                <li>当日异常</li>
                <li>连续3日异常</li>
                <li>连续6日异常</li>
                <li>30日内全部正常</li>
                <li>30日内6日以上异常</li>
            </ul>
            <span class="set">查 岗</span>
        </div>
        <div class="main" >
            <span class="contit">当日状态</span>
            
            <div class="content">
                <div class="queryall">
                    
                        
                        <button class="submit" onclick="submitHistory()">查 看</button>
                   	 <form>
                        <input type="reset" value="重 置" />
                        <input type="text" id="endTime" placeholder="结束时间" onclick="WdatePicker({ dateFmt: 'yyyy-MM-dd HH:mm:ss', skin: 'twoer' })" /><span>-</span>
                        <input type="text" id="startTime" placeholder="开始时间" onclick="WdatePicker({ dateFmt: 'yyyy-MM-dd HH:mm:ss', skin: 'twoer' })" />
                    </form>
                </div>
                <!--当日状态-->
                <div class="mapa">
                    <div id="map"></div>
                </div>
                <div class="tablea">
                    <div class="tabletit">
                        <span class="tabletitle">今日数据</span>
                        <button>导 出</button>
                    </div>
                    <div class="tablebox">
                        <table id="list2"></table> 
		                <div id="pager2"></div>
                    </div>
                </div> 
                <!--当日异常-->
                <div class="mapa dismaps" >
                    <div id="map2"></div>
                </div>
                <div class="tablea dismaps">
                    <div class="tabletit">
                        <span class="tabletitle">今日数据</span>
                        <button>导 出</button>
                    </div>
                    <div class="tablebox">
                        <table id="list22"></table> 
		                <div id="pager22"></div>
                    </div>
                </div>
                <!--3日异常-->
                <div class="mapa dismaps" >
                    <div id="map3"></div>
                </div>
                <div class="tablea dismaps">
                    <div class="tabletit">
                        <span class="tabletitle">3日异常数据</span>
                        <button>导 出</button>
                    </div>
                    <div class="tablebox">
                        <table id="list23"></table> 
		                <div id="pager23"></div>
                    </div>
                </div>
                <!--6日异常-->
                <div class="mapa dismaps" >
                    <div id="map4"></div>
                </div>
                <div class="tablea dismaps">
                    <div class="tabletit">
                        <span class="tabletitle">6日异常数据</span>
                        <button>导 出</button>
                    </div>
                    <div class="tablebox">
                        <table id="list24"></table> 
		                <div id="pager24"></div>
                    </div>
                </div>
                <!--30日正常-->
                <div class="mapa dismaps" >
                    <div id="map5"></div>
                </div>
                <div class="tablea dismaps">
                    <div class="tabletit">
                        <span class="tabletitle">30日全部正常数据</span>
                        <button>导 出</button>
                    </div>
                    <div class="tablebox">
                        <table id="list25"></table> 
		                <div id="pager25"></div>
                    </div>
                </div>
                <!--30日6日异常-->
                <div class="mapa dismaps" >
                    <div id="map6"></div>
                </div>
                <div class="tablea dismaps">
                    <div class="tabletit">
                        <span class="tabletitle">30日有6日异常数据</span>
                        <button>导 出</button>
                    </div>
                    <div class="tablebox">
                        <table id="list26"></table> 
		                <div id="pager26"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="main2" style="display:none;">
            <iframe class="framebox" src="inspectFrame.html"></iframe>
        </div>
    </div>
</body>
</html>

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=KeifZWatjhWfAh7sSauY6BhBOPfA01yp"></script>
<script type="text/javascript" src="data/points-sample-data.json"></script>    <!--正常数据点-->
<script src="js/index1.js"></script>
<script src="js/login1.js"></script>
<script type="text/javascript">
	
	

    $(function () {
    	
    	var username={};
    	$.ajax({
            async: false,
    		cache:false,
            type: 'POST',
            url: "PeopleAction_index.action",
            dataType:"json",
            success: function (data) {
            	msg = eval("(" + data + ")");
            	
            	username=msg.msg;
            //	username=data.replace(/\"/g,'');
            },
            error: function () {
                alert("出现异常！！");
            }
        });
    	
    	$(function(){
    		$("#username").text(username);
    	});
    	
        $(".set").click(function () {
            $(".main").css("display", "none");
            $(".main2").css("display", "block");
            //alert($(".framebox").width());  //显示frame页面的宽度，用于设置@media；
        });

    });
    
    
    //查询历史记录
        function submitHistory() {
    		var stime = $("input#startTime").val();
    		var etime = $("input#endTime").val();
    		if(stime.length == 0 || etime.length == 0) {
    			alert("请选择需要查找的时间段！");
    		} else {
    			layer.open({
    				type:2,
    				area:['80%','80%'],
    				fixed:true,//不固定
    				maxmin:true,
    				content:'alllayer.html',
    				success:function(layero,index) {
    					var body = layer.getChildFrame('body',index); //layer插件 type2（iframe） 将父页面的数据传给子页面
    					body.contents().find("#date1").text(stime);
    					body.contents().find("#date2").text(etime);
    				}
    			});
    		}
    	};
    	
    function quit(){
    	
    	$.ajax({
            async: false,
    		cache:false,
            type: 'POST',
            url: "PeopleAction_quit.action",
            dataType:"json",
            success: function (data) {
            	alert("退出成功！！");
            	window.location.href = "login.html";
            },
            error: function () {
                alert("出现异常！！");
            }
        });

    }
    
</script>